<template>
    <div class="take">
        <h5 class="flex aic title" @click="() => { emits('change') }">PURCHASE TAKE LIST</h5>
        <div class="orderlist phighit">
            <el-table ref="takeOrderList" :data="purcharseTakeList" v-loading="takeLeading"
                @selection-change="SelectionMethod" :cell-style="setCellStyle" :row-class-name="TakeList"
                v-el-table-infinite-scroll="refresh" @row-click="getPurTakeID" height="100%">
                <el-table-column type="selection" width="20" />
                <el-table-column fixed prop="PI_name" label="Ptask ID" width="150" />
                <el-table-column prop="state_text" label="Sate" width="120" />
                <el-table-column prop="sale" label="Sales" width="120" />
                <el-table-column prop="purchaser" label="Purchase" width="120" />
                <el-table-column prop="items" label="Items" />
                <el-table-column prop="create_time" sortable label="CreationTime" width="200" />
            </el-table>
        </div>

    </div>
</template>

<script setup>
import { ref } from 'vue'
const props = defineProps({
    takeLeading: Boolean,
    purcharseTakeList: Object,
    purchaseordertesk_id: Number
})
const takeOrderList = ref()
const setCellStyle = ({ row }) => {
    if (row.purchaseordertesk_id == props.purchaseordertesk_id) {
        return {
            // backgroundColor: "rgba(174, 179, 179, 0.219) !important"
            color: '#409eff !important'
        }
    }
}
const emits = defineEmits(['change', 'refreshPurTakeList', 'getPurTake', 'SelectionMethod'])
const refresh = () => {
    emits('refreshPurTakeList')
}
const getPurTakeID = (row) => {
    emits('getPurTake', row)
}
const SelectionMethod = (val) => {
    emits('SelectionMethod', val)
}
defineExpose({
    takeOrderList
})
</script>

<style lang="less">
.take {
    width: 100%;

    .title {
        height: 4vh;
        padding-left: 10px;
    }

    .orderlist {
        padding: 10px;
        background-color: #ffffff;
        border-radius: 10px;
        height: 42vh;
    }

    .el-table .cell {
        padding: 0;
    }
}
</style>